<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro"
      xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../../../assert/css/font.css" th:href="@{/assert/css/font.css}"/>
    <link rel="stylesheet" href="../../../assert/css/bootstrap.min.css" th:href="@{/assert/css/bootstrap.min.css}"/>
    <link rel="stylesheet" href="../../../assert/css/plugin/chosen/chosen.css"
          th:href="@{/assert/css/plugin/chosen/chosen.css}"/>
    <link rel="stylesheet" href="../../../assert/css/bootstrap-table.css" th:href="@{/assert/css/bootstrap-table.css}"/>
    <link href="../../../assert/css/animate.min.css" rel="stylesheet" th:href="@{/assert/css/animate.min.css}">
    <link href="../../../assert/css/plugin/toastr/toastr.min.css" rel="stylesheet"
          th:href="@{/assert/css/plugin/toastr/toastr.min.css}">
    <link href="../../../assert/css/plugin/jsTree/themes/default/style.css" rel="stylesheet"
          th:href="@{/assert/css/plugin/jsTree/themes/default/style.css}">
    <link href="../../../assert/css/loaders.css" rel="stylesheet"
          th:href="@{/assert/css/loaders.css}">
    <link rel="stylesheet" href="../../../assert/css/index.css" th:href="@{/assert/css/index.css(v_=${@commonController.getSysConfigByPK('CACHE_CODE')})}"/>
    <style>
        .search_group label.control-label {
            width: 85px;
        }
    </style>
</head>
<body>
<a id="basePath" th:href="@{/}"></a>
<div class="wrapper wrapper-content">
    <div class="ibox">
        <div class="tools_bar">
            <div class="pull-left">
                <a href="#" class="btn btn-default active" id="btnSearch" title="隐藏查询条"><i class="fa fa-filter"></i> 隐藏</a>
                <a href="#" class="btn btn-default active" id="refresh"><i class="fa fa-refresh"></i> 刷新</a>
            </div>
        </div>
        <div class="search on">
            <div class="search_group">
                <label class="control-label"><span class="respan">*</span>省份：</label>
                <div class="control-inline">
                    <select type="text" id="pro" value="" class="form-control search_input"></select>
                </div>
            </div>
            <div class="search_group">
                <label class="control-label"><span class="respan">*</span>回调时间：</label>
                <div class="control-inline">
                    <input placeholder="开始日期" class="form-control layer-date search_input" id="callStartTime"
                           autocomplete="off"> -
                    <input placeholder="结束日期" class="form-control layer-date search_input" id="callEndTime"
                           autocomplete="off">
                </div>
            </div>
            <div class="search_group">
                <button id="search" class="btn  btn-primary">查询</button>
                <button id="reset" class="btn  btn-default">重置</button>
                <button id="export" class="btn  btn-default">导出</button>
            </div>
            <!--<div class="search_group">-->
            <!--<div style="margin-left:20px">总量：<span style="font-weight: bold">10000</span></div>-->
            <!--</div>-->
        </div>

        <table id="myTable"></table>
    </div>
</div>
<input type="text" id="tagId" class="hidden">
<input type="text" id="tagType" class="hidden">

<form action="" id="exportForm" class="hidden" method="get">
    <input type="text" id="provinceCodeE" name="provinceCode">
    <input type="text" id="callStartTimeE" name="startTime">
    <input type="text" id="callEndTimeE" name="endTime">
</form>
<input type="hidden" id="tagTreeId" value="" class="form-control search_input">
<input type="hidden" id="areaTreeId" value="" class="form-control search_input">
<input type="hidden" id="tagTreeName" value="" class="form-control search_input">
<script src="../../../assert/js/jquery.js" th:src="@{/assert/js/jquery.js(v_=${@commonController.getSysConfigByPK('CACHE_CODE')})}"></script>
<script src="../../../assert/js/bootstrap.min.js" th:src="@{/assert/js/bootstrap.min.js(v_=${@commonController.getSysConfigByPK('CACHE_CODE')})}"></script>
<script src="../../../assert/js/plugin/bootstrap-table/bootstrap-table.min.js"
        th:src="@{/assert/js/plugin/bootstrap-table/bootstrap-table.min.js(v_=${@commonController.getSysConfigByPK('CACHE_CODE')})}"></script>
<script src="../../../assert/js/plugin/bootstrap-table/bootstrap-table-mobile.min.js"
        th:src="@{/assert/js/plugin/bootstrap-table/bootstrap-table-mobile.min.js}"></script>
<script src="../../../assert/js/plugin/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"
        th:src="@{/assert/js/plugin/bootstrap-table/locale/bootstrap-table-zh-CN.min.js}"></script>
<script src="../../../assert/js/plugin/toastr/toastr.min.js"
        th:src="@{/assert/js/plugin/toastr/toastr.min.js}"></script>
<script src="../../../assert/js/base.js" th:src="@{/assert/js/base.js(v_=${@commonController.getSysConfigByPK('CACHE_CODE')})}"></script>
<script src="../../../assert/js/jquery-ui.min.js" th:src="@{/assert/js/jquery-ui.min.js}"></script>
<script src="../../../assert/js/plugin/layer/laydate/laydate.js"
        th:src="@{/assert/js/plugin/layer/laydate/laydate.js}"></script>
<script src="../../../assert/js/changeTime.js" th:src="@{/assert/js/changeTime.js(v_=${@commonController.getSysConfigByPK('CACHE_CODE')})}"></script>
<script src="../../../assert/js/plugin/jsTree/jstree.min.js"
        th:src="@{/assert/js/plugin/jsTree/jstree.min.js}"></script>
<script src="../../../assert/js/plugin/chosen/chosen.jquery.js"
        th:src="@{/assert/js/plugin/chosen/chosen.jquery.js}"></script>
<script src="../../../assert/js/contabs.min.js" th:src="@{/assert/js/contabs.min.js(v_=${@commonController.getSysConfigByPK('CACHE_CODE')})}"></script>
<script src="../../../assert/js/common.js" th:src="@{/assert/js/common.js(v_=${@commonController.getSysConfigByPK('CACHE_CODE')})}"></script>
<script>
    //项目名称
    var basePath = $("#basePath").attr("href");
    var resize = {
        init: function () {
            resize.me();
            $(window).resize(function () {
                resize.me();
            })
        },
        me: function () {
            var winW = $(window).width();
            var winH = $(window).height();
            $(".ibox").width(winW - 20);
            $(".ibox").height(winH - 20);
            bs.autoTableHeight($('#myTable'),winH -$(".tools_bar").height()-22-$(".search").height())
        }
    };
    var tools = {
        num:0,
        modelSelectAudioArr: [],
        tableData: [],
        tagNameArr: [],
        init: function () {
            bs.dataTime("#callStartTime", "#callEndTime", "YYYY-MM-DD");
            tools.tabSearch();
            tools.search();
            tools.reset();
            tools.refresh();
            tools.enterSearch();
            tools.export();
            tools.selectProvince();
//            tools.getNowTime();
        },
        selectProvince: function () {
            tools.proArr = bs.getProvince();
            tools.proArr.shift();
            tools.proArr.unshift({"name":"请选择","value":"-1"});
            bs.selectDown($("#pro"), tools.proArr, "");
            if($("#spanId",parent.document).attr("data-procode")!=""){
                if(tools.proArr.length==2){
                    $("#pro").val(tools.proArr[1].value).prop("disabled", true).trigger("chosen:updated");
                }
            }
        },
        tabSearch: function () {
            var search = $(".search");
            $("#btnSearch").on("click", function () {
                if (search.hasClass("on")) {
                    search.slideUp();
                    search.removeClass("on");
                    $("#btnSearch").html('<i class="fa fa-filter"></i> 查询').attr("title", "显示查询条");
                } else {
                    search.slideDown();
                    search.addClass("on");
                    $("#btnSearch").html('<i class="fa fa-filter"></i> 隐藏').attr("title", "隐藏查询条");
                }

            });
        },
        search: function () {
            $("#search").on("click", function () {
                var res = tools.searchValidate();
                if (res) {
                    tools.tableRefresh();
                }
            })
        },
        searchValidate: function () {
            var res = false;
            if ($("#pro").val() == "-1") {
                toastrCog.error("请选择省份！", 3000)
            }else if ($("#callStartTime").val() == "") {
                toastrCog.error("请选择回调开始时间！", 3000)
            } else if ($("#callEndTime").val() == "") {
                toastrCog.error("请选择回调结束时间！", 3000)
            } else {
                res = true;
            }
            return res;

        },
        tableRefresh: function () {
            if(tools.num==0){
                var oTable = new TableInit();
                oTable.Init();
            }else{
                $("#myTable").bootstrapTable('refreshOptions', {pageNumber:1});
                $("#myTable").bootstrapTable('refresh');
            }
            tools.num++;
        },
        reset: function () {
            $("#reset").on("click", function () {
                bs.resetSearch($(".search"));
                if($("#laydate_box").length>0){
                    bs.resetTimeElems("#callStartTime","#callEndTime");
                }
                if($("#spanId",parent.document).attr("data-procode")==""){
                    $("#pro").val("-1").trigger("chosen:updated");
                }
                var oTable = new TableInitOne();
                oTable.Init();
                tools.num=0;
            })
        },
        resetSelect: function ($obj) {
            $obj.val("");
            $obj.trigger("chosen:updated");
        },
        refresh: function () {
            $("#refresh").on("click", function () {
                $("#myTable").bootstrapTable('refresh');
            })
        },
        enterSearch: function () {
            $("body").on("keyup", function (e) {
                var code = e.charCode || e.keyCode;
                if (code == 13) {
                    //此处编写用户敲回车后的代码
                    $("#search").click();
                }
            })
        },
        export: function () {
            $("#export").on("click", function () {
                if (tools.tableData.length<=0) {
                    toastrCog.error("没有可导出的数据哦！", 3000)
                    return;
                }
                var form = $("#exportForm");
                form.attr("action",  bs.getSysConfig("ENG_NO_STATISTIC").value + "/exportExcel/countInfoExport");
                $("#provinceCodeE").val($("#pro").val());
                $("#callStartTimeE").val($("#callStartTime").val());
                $("#callEndTimeE").val($("#callEndTime").val());
                form[0].submit();
            })

        },
        getNowTime: function () {
            var endTime = dateFormatUtil(new Date().getTime());
            var str = endTime.split(" ")[0];
            var startTime = str + " " + "00:00:00";
            $("#callStartTime").val(startTime);
            $("#callEndTime").val(endTime);
        }

    };
    var TableInit = function () {
        var oTableInit = new Object();
        var url = bs.getSysConfig("ENG_NO_STATISTIC").value+'/dataCount/countInfo';
        var height = ($(window).height() -$(".tools_bar").height()-9-$(".search").height()-40);
        //初始化Table
        oTableInit.Init = function () {
            $('#myTable').bootstrapTable('destroy');
            $('#myTable').bootstrapTable({
                url: url,         //请求后台的URL（*）
                method: 'post',                      //请求方式（*）
                cache: false,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
                height:height,
                pagination: true,                   //是否显示分页（*）
                queryParams: oTableInit.queryParams,//传递参数（*）
                responseHandler: function (res) {
                    if (res.code != 0) {
//                        toastrCog.error(res.msg, 2000);
                    }
                    tools.tableData = res.data.list;
                    return {
                        "total": res.data.total,//总页数
                        "rows": res.data.list   //数据
                    };
                },
                sidePagination: "server",           //分页方式：client客户端分页，server服务端分页（*）
                pageNumber: 1,                       //初始化加载第一页，默认第一页
                pageSize: 10,                       //每页的记录行数（*）
                pageList: [10, 25, 50, 100],        //可供选择的每页的行数（*）
                search: false,                       //是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大
                contentType: "application/json",
                strictSearch: true,
                showColumns: false,                  //是否显示所有的列
                showRefresh: false,                  //是否显示刷新按钮
                minimumCountColumns: 2,             //最少允许的列数
                clickToSelect: true,                //是否启用点击选中行
//                uniqueId: "serialNumber",                     //每一行的唯一标识，一般为主键列
                showToggle: false,                    //是否显示详细视图和列表视图的切换按钮
                cardView: false,                    //是否显示详细视图
                detailView: false,
                cellStyle: {
                    css: {"background-color": "#fff"}
                },//是否显示父子表
                columns: [
//                    {
//                        checkbox: true, // 显示一个勾选框
//                        align: 'center' // 居中显示
//                    },
                    {
                        align: "center",
                        halign: "center",
                        title: '序号',//标题  可不加
                        width: 60,
                        formatter: function (value, row, index) {
                            var getOptions = $("#myTable").bootstrapTable('getOptions');
                            var pagenum = getOptions.pageNumber;
                            var pagesize = getOptions.pageSize;
                            var st = (pagenum - 1) * pagesize;
                            return (st + index + 1) + "";
                        }
                    },
                    {
                        align: "center",
                        halign: "center",
                        field: 'provinceCode',
                        title: '省份',
                        sortable: true,
                        formatter: function (value, row, index) {
                            return bs.getXInY(tools.proArr,"name","value",value);
                        }
                    },
                    {
                        align: "center",
                        halign: "center",
                        field: 'createTime',
                        title: '回调时间',
                        sortable: true
                    },
                    {
                        align: "center",
                        halign: "center",
                        field: 'successNum',
                        title: '成功量',
                        sortable: true
                    },
                    {
                        align: "center",
                        halign: "center",
                        field: 'exceptionNum',
                        title: '异常量',
                        sortable: true
                    },
                    {
                        align: "center",
                        halign: "center",
                        field: 'timedOutNum',
                        title: '超时量',
                        sortable: true
                    },
                    {
                        align: "center",
                        halign: "center",
                        field: 'nlpVisitNum',
                        title: '调用语义语音量',
                        sortable: true
                    },
                    {
                        align: "center",
                        halign: "center",
                        field: 'timedOutNlpVisitNum',
                        title: '超时重调语音量',
                        sortable: true
                    },
                    {
                        align: "center",
                        halign: "center",
                        field: 'successCallBackNum',
                        title: '成功回调语音量',
                        sortable: true
                    }
                ],
                onLoadSuccess: function (data) {  //加载成功时执行
                    resize.me();
                    if (!data.rows || data.rows.length == 0) {
                        var src = basePath + "/assert/image/nodata.png";
                        $(".no-records-found").find("td").html('<img src="' + src + '" th:src="@{/assert/image/nodata.png}" style="width:165px;" alt="">');
                    }
                },
                onLoadError: function () {  //加载失败时执行
                    var src = basePath + "/assert/image/nodata.png";
                    $(".no-records-found").find("td").html('<img src="' + src + '" th:src="@{/assert/image/nodata.png}" style="width:165px;" alt="">');
                },
                formatLoadingMessage: function () {
                    return '<div class="loaded">' +
                        '<div class="loader">' +
                        '<div class="loader-inner line-scale-pulse-out">' +
                        '<div></div>' +
                        '<div></div>' +
                        '<div></div>' +
                        '<div></div>' +
                        '<div></div>' +
                        '</div>' +
                        '</div>' +
                        '</div>' +
                        '<div>请稍等，数据正在加载中...</div>';
                }
            });
        };
        //得到查询的参数
        oTableInit.queryParams = function (params) {
            var temp = {   //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
                pageNum: (params.offset / params.limit)+1,   //页面大小
                pageSize: params.limit,
                provinceCode: $("#pro").val(),
                startTime: $("#callStartTime").val(),
                endTime: $("#callEndTime").val()
            };
            return temp;
        };
        return oTableInit;
    };
    var TableInitOne = function () {
        var oTableInit = new Object();
        //初始化Table
        oTableInit.Init = function () {
            $('#myTable').bootstrapTable('destroy');
            $('#myTable').bootstrapTable({
                data:[],
                cache: false,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
                pagination: true,                   //是否显示分页（*）
                sidePagination: "server",           //分页方式：client客户端分页，server服务端分页（*）
                pageNumber: 1,                       //初始化加载第一页，默认第一页
                pageSize: 10,                       //每页的记录行数（*）
                pageList: [10, 25, 50, 100],        //可供选择的每页的行数（*）
                search: false,                       //是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大
                contentType: "application/json",
                strictSearch: true,
                showColumns: false,                  //是否显示所有的列
                showRefresh: false,                  //是否显示刷新按钮
                minimumCountColumns: 2,             //最少允许的列数
                clickToSelect: true,                //是否启用点击选中行
//                uniqueId: "serialNumber",                     //每一行的唯一标识，一般为主键列
                showToggle: false,                    //是否显示详细视图和列表视图的切换按钮
                cardView: false,                    //是否显示详细视图
                detailView: false,
                cellStyle: {
                    css: {"background-color": "#fff"}
                },//是否显示父子表
                columns: [
//                    {
//                        checkbox: true, // 显示一个勾选框
//                        align: 'center' // 居中显示
//                    },
                    {
                        align: "center",
                        halign: "center",
                        title: '序号',//标题  可不加
                        width: 60,
                        formatter: function (value, row, index) {
                            var getOptions = $("#myTable").bootstrapTable('getOptions');
                            var pagenum = getOptions.pageNumber;
                            var pagesize = getOptions.pageSize;
                            var st = (pagenum - 1) * pagesize;
                            return (st + index + 1) + "";
                        }
                    },
                    {
                        align: "center",
                        halign: "center",
                        field: 'serialNumber',
                        title: '省份',
                        sortable: true
                    },
                    {
                        align: "center",
                        halign: "center",
                        field: 'serialNumber',
                        title: '回调时间',
                        sortable: true
                    },
                    {
                        align: "center",
                        halign: "center",
                        field: 'content',
                        title: '成功量',
                        sortable: true
                    },
                    {
                        align: "center",
                        halign: "center",
                        field: 'inputTime',
                        title: '异常量',
                        sortable: true
                    },
                    {
                        align: "center",
                        halign: "center",
                        field: 'inputTime',
                        title: '超时量',
                        sortable: true
                    },
                    {
                        align: "center",
                        halign: "center",
                        field: 'nlpVisitNum',
                        title: '调用语义语音量',
                        sortable: true
                    },
                    {
                        align: "center",
                        halign: "center",
                        field: 'timedOutNlpVisitNum',
                        title: '超时重调语音量',
                        sortable: true
                    },
                    {
                        align: "center",
                        halign: "center",
                        field: 'successCallBackNum',
                        title: '成功回调语音量',
                        sortable: true
                    }
                ],
                onPostBody:function(){
                    $(".no-records-found").find("td").html("<div style='height:50px;line-height: 50px;'>亲，请选择必选条件哦！</div>")
                }
            });
        };
        return oTableInit;
    };
    $(function () {
        tools.init();
        var oTable = new TableInitOne();
        oTable.Init();
        resize.init();
    })
</script>
</body>
</html>